<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Neumorphic Loading Animation</title>
		<link rel="stylesheet" href="./loading.css" />
	</head>
	<body>
		<!-- Inpired from the work of https://codingartistweb.com/2020/09/neumorphism-loading-animation-css/
		https://codepen.io/Coding-Artist/pen/MWyNjwV  
		Check out his work for more cool CSS stuff-->
		<div class="wrapper">
		  <div class="rings">
		    <div class="ring ring1">
		    <div class="ring ring2">
		    <div class="ring ring3">
		    <div class="ring ring4"></div>
		    </div>
		    </div>
		    </div>
		  </div>
		  <div class="choose-theme">
		    <div class="theme theme1" onclick="chooseTheme('#ffad00')"></div>
		    <div class="theme theme2" onclick="chooseTheme('#01c5c4')"></div>
		    <div class="theme theme3" onclick="chooseTheme('#ffa5a5')"></div>
		    <div class="theme theme4" onclick="chooseTheme('#d789d7')"></div>
		    <div class="theme theme5" onclick="chooseTheme('#f09ae9')"></div>
		    <div class="theme theme6" onclick="chooseTheme('#e7305b')"></div>
		    <div class="theme theme7" onclick="chooseTheme('#303960')"></div>
		  </div>
		</div>
		<script src="./loading.js"></script>
	</body>
</html>